import React, { Component } from 'react'
import { withRouter } from 'react-router-dom/cjs/react-router-dom.min'
import styles from './login.module.css'

class Login extends Component {
  state = {
    username: 'admin',
    password: '123'
  }

  change = e => {
    this.setState({
      [e.target.name]: e.target.value
    })
  }
  login = () => {
    const { username, password } = this.state

    if (username === 'admin' && password === '123') {
      // this.props.history.push('/layout')
      localStorage.setItem('token', 'sjfos12')
      if (this.props.location.search) {
        const searchParams = new URLSearchParams(this.props.location.search)
        const redirect = searchParams.get('redirect')
        this.props.history.push(redirect)
      } else {
        this.props.history.push('/layout')
      }
    } else {
      alert('用户名或密码错误')
    }
  }
  render () {
    return (
      <div className={styles['login-contian']}>
        xx管理系统
        <p>
          <label>用户名:</label>
          <input
            type='text'
            name='username'
            value={this.state.username}
            onChange={this.change}
          />
        </p>
        <p>
          <label>密&nbsp;&nbsp;&nbsp;&nbsp;码:</label>
          <input
            type='password'
            name='password'
            value={this.state.password}
            onChange={this.change}
          />
        </p>
        <p>
          <button onClick={this.login}>登录</button>
        </p>
      </div>
    )
  }
}
export default withRouter(Login)
